<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>
<title>之江学院考试</title>
<link href='exam.css' rel='stylesheet' type='text/css'>
</head>
<body>
<h1>
浙江工业大学之江学院20 20 /20 21 学年
<br>
第 1 学期试卷
</h1>
<table class='name' width='100%'>
<tr>
<td colspan='2'>
课程
<span class='filling2'></span>
</td>
<td colspan='2'>
班级
<span class='filling2'></span>
</td>
</tr>
<tr>
<td>
姓名
<span class='filling1'></span>
</td>
<td colspan='2'>
学号
<span class='filling2'></span>
</td>
<td>
教师姓名
<span class='filling1'></span>
</td>
</tr>
</table>
<table border='1' class='score' rules='all' width='85%'>
<tr>
<th>题序</th>
<td>一</td>
<td>二</td>
<td>三</td>
<td>四</td>
<td>五</td>
<td>总分</td>
</tr>
<tr>
<th>计分</th>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
<br>
<div class='page1'>
<h2>填空题(40分)</h2>
<ol>
<li>
根据标签是否成对出现，HTML标签分为：
<span class='filling'></span>
、
<span class='filling'></span>
。
</li>
<li>
写出两个常见的HTML标签属性：
<span class='filling'></span>
、
<span class='filling'></span>
。
</li>
<li>
<span class='filling'></span>
是和流动相对的概念。可用来实现文字围绕效果。
</li>
<li>
HTML代码
<xmp class='code'><div><span class="head">入</span>夜渐微凉 繁花落地成霜</div></xmp>
中, 标签
<span class='filling'></span>
继承标签
<span class='filling'></span>
的样式。
</li>
<li>
若用类名定位网页元素
<xmp class='code'><p id="adgy" class="song">把你捧在手上 虔诚地焚香</p></xmp>
则选择器为
<span class='filling'></span>
。
</li>
<li>
当同一个网页元素被两组不同的CSS声明语句渲染时，根据选择器的
<span class='filling'></span>
来选择最终使用的CSS样式。
</li>
<li>
网页中每个元素根据
<span class='filling'></span>
模型显示。构成这个模型的四大要素：
<span class='filling'></span>
、
<span class='filling'></span>
、
<span class='filling'></span>
、
<span class='filling'></span>
。
</li>
<li>
CSS 代码应该写在标签
<span class='filling'></span>
里，引用外部css文件要写在标签
<span class='filling'></span>
里，而嵌入到HTML标签中，可设置属性
<span class='filling'></span>
。
</li>
<li>
写出三种常用 DOM 节点访问方法：
<span class='filling'></span>
、
<span class='filling'></span>
、
<span class='filling'></span>
。
</li>
</ol>
<h2>判断题 (20分)</h2>
<ol>
<li>
行内元素通常无法调整高宽，而块状元素可以。
<span class='parenthesis'>
<span class='yes_no'></span>
</span>
</li>
<li>
浏览器窗口X-Y轴和解析几何中的X-Y轴方向一致。
<span class='parenthesis'>
<span class='yes_no'></span>
</span>
</li>
<li>
默认设置下，背景色一般正好覆盖到盒模型的内边距部分。
<span class='parenthesis'>
<span class='yes_no'></span>
</span>
</li>
<li>
JavaScript 用 script 标签导入外部文件。
<span class='parenthesis'>
<span class='yes_no'></span>
</span>
</li>
<li>
盒子模型只在设置背景图片的情况下才存在。
<span class='parenthesis'>
<span class='yes_no'></span>
</span>
</li>
<li>
定位时，子元素可能会超出父元素的显示范围。
<span class='parenthesis'>
<span class='yes_no'></span>
</span>
</li>
<li>
列表中列表项总是独立成一段显示，说明列表项是块状元素。
<span class='parenthesis'>
<span class='yes_no'></span>
</span>
</li>
<li>
设置浮动效果的元素不能直接影响其父元素以外的元素。
<span class='parenthesis'>
<span class='yes_no'></span>
</span>
</li>
<li>
默认情况下，标签 body 中的JavaScript代码是在当前位置执行，但可以操作HTML任何已经加载好的元素。
<span class='parenthesis'>
<span class='yes_no'></span>
</span>
</li>
<li>
DOM中的元素节点大体上和HTML的标签一一对应。
<span class='parenthesis'>
<span class='yes_no'></span>
</span>
</li>
</ol>
</div>
<footer></footer>
<br>
<header>浙江工业大学之江学院考试命题纸</header>
<div class='page'>
<h2>选择题(20分)</h2>
<ol>
<li>
HTML标签可分为哪两种标签？
<span class='parenthesis'>
<span class='choice'></span>
</span>
<ol type='A'>
<li>空标签和非空标签</li>
<li>闭标签和开标签</li>
<li>闭合标签和空标签</li>
<li>双标签和单标签</li>
</ol>
</li>
<li>
网页根标签是
<span class='parenthesis'>
<span class='choice'></span>
</span>
<ol type='A'>
<li>
<xmp><html></xmp>
</li>
<li>
<xmp><head></xmp>
</li>
<li>
<xmp><body></xmp>
</li>
<li>
<xmp><meta></xmp>
</li>
</ol>
</li>
<li>
CSS实现的是什么功能？
<span class='parenthesis'>
<span class='choice'></span>
</span>
<ol type='A'>
<li>内容和样式分离</li>
<li>内容和资源分离</li>
<li>内容和源代码分离</li>
<li>内容和数据分离</li>
</ol>
</li>
<li>
应用下述样式的效果为：
<span class='parenthesis'>
<span class='choice'></span>
</span>
<xmp class='code'>p {color:red;}
span {font-size: large;
font-weight: bold;}
<p>
<span>春</span>眠不觉晓，处处闻啼鸟。 夜来风雨声，花落知多少。
</p></xmp>
<ol type='A'>
<li>
<xmp>整首诗红色、加粗、放大</xmp>
</li>
<li>
<xmp>整首诗红色，第一个字加粗、放大</xmp>
</li>
<li>
<xmp>整首诗红色，第一个字加粗、放大但不是红色</xmp>
</li>
<li>
<xmp>第一个字加粗、放大；其他字默认字体</xmp>
</li>
</ol>
</li>
<li>
能精确定位到“秦”字的选择器是
<span class='parenthesis'>
<span class='choice'></span>
</span>
<xmp class='code'>
<div>
<span class="head">秦</span>
<span class="tail">时明月汉时关,万里长征人未还。但使龙城飞将在,不教胡马度阴山。
</span>
</div>
</xmp>
<ol type='A'>
<li>
<xmp>span</xmp>
</li>
<li>
<xmp>div span</xmp>
</li>
<li>
<xmp>div .head</xmp>
</li>
<li>
<xmp>div span .head</xmp>
</li>
</ol>
</li>
</ol>
</div>
<footer></footer>
<br>
<header>浙江工业大学之江学院考试命题纸</header>
<div class='page'>
<ol start='6'>
<li>
JavaScript实现的是什么功能？
<span class='parenthesis'>
<span class='choice'></span>
</span>
<ol type='A'>
<li>内容和样式分离</li>
<li>内容和特效和互动功能的分离</li>
<li>内容和资源分离</li>
<li>内容和数据分离</li>
</ol>
</li>
<li>
下面哪个选择器的声明语句无法影响“独”字？
<span class='parenthesis'>
<span class='choice'></span>
</span>
<xmp class='code'><div>
<span class="title">《鹿柴》[唐] 王维</span>
<p>
<span class="head">空</span>
<span>山不见人，但闻人语响。 返影入深林，复照青苔上。</span>
</p>
</div></xmp>
<ol type='A'>
<li>
<xmp>div .head</xmp>
</li>
<li>
<xmp>p>span</xmp>
</li>
<li>
<xmp>div>span</xmp>
</li>
<li>
<xmp>.title, .head</xmp>
</li>
</ol>
</li>
<li>
经常逛淘宝的同学知道，不用点击菜单，只要鼠标滑过菜单时，
就会显示一些隐藏的商品信息或高亮一些暗淡的文字。
<br>
这主要是通过什么实现的？
<span class='parenthesis'>
<span class='choice'></span>
</span>
<ol type='A'>
<li>设置text-decoration等文本修饰属性</li>
<li>JavaScript动态特效</li>
<li>CSS动画特效</li>
<li>设置鼠标悬停伪选择器</li>
</ol>
</li>
<li>
B 站主页导航栏其实是一个无序列表。为什么这个无序列表不是纵向排列，而是横向排列？
<span class='parenthesis'>
<span class='choice'></span>
</span>
<ol type='A'>
<li>CSS样式文件丢失</li>
<li>浮动效果</li>
<li>B站服务器故障</li>
<li>浏览器故障</li>
</ol>
</li>
<li>
浏览器解析下面的HTML代码，会有什么特效
<span class='parenthesis'>
<span class='choice'></span>
</span>
<xmp class='code'>
<h1>修改字母</h1>
<span>A</span>
<script type='text/javascript'>
spans[0].innerText = 'B'
spans = document.getElementsByTagName('span')
function f(){
spans[0].innerText = 'C'
}
span.onclick = f
</script>
</xmp>
<ol type='A'>
<li>有特效，鼠标点击字母A变成C</li>
<li>有特效，鼠标点击字母B变成C</li>
<li>没有特效，显示字母B</li>
<li>没有特效，显示两个字母AB</li>
</ol>
</li>
</ol>
</div>
<footer></footer>
<br>
<header>浙江工业大学之江学院考试命题纸</header>
<div class='page'>
<h2>简答题(20分)</h2>
<ol>
<li>
下面是一段诗。准备一张图片，如poem.jpg。给这断文字添加背景图片，文字在图片中居中，合理控制上下边距。
<xmp class='code'>
<div class='poem'>
我总是想些无关紧要的事<br/>
比如宇宙的目的，熬夜与猝死的关系<br/>
你是否曾爱我
</div>
</xmp>
<div class='solve'>
<xmp class='code'>
1
2
3
4
5
6
7
8
9
10
11
12
</xmp>
</div>
</li>
<li>
下面是一段文章。标题居中加粗；第一个词放大到3倍，加粗，其余文字环绕。(8分)
<xmp class='code'>
<article>
<div class="title">荷塘月色</div>
<address>朱自清</address>
<p>
<span class="head">月</span>光如流水一般，静静地泻在这一片叶子和花上。
薄薄的青雾浮起在荷塘里。
叶子和花仿佛在牛乳中洗过一样；又像笼着轻纱的梦。
虽然是满月，天上却有一层淡淡的云，所以不能朗照；
但我以为这恰是到了好处——酣眠固不可少，小睡也别有风味的。
月光是隔了树照过来的，高处丛生的灌木，落下参差的斑驳的黑影，峭楞楞如鬼一般；
弯弯的杨柳的稀疏的倩影，却又像是画在荷叶上。
塘中的月色并不均匀；但光与影有着和谐的旋律，如梵婀玲上奏着的名曲。
</p>
</article>
</xmp>
<div class='solve'>
<xmp class='code'>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
</xmp>
</div>
</li>
</ol>
</div>
<footer></footer>
<br>
<header>浙江工业大学之江学院考试命题纸</header>
<div class='page'>
<ol start='3'>
<li>
下面是B站首页导航栏列表（已经简化）。已知这是文档节点中第一个无序列表节点。怎样能合理地把“游戏中心”改为“学习资料”？
<xmp class='code'>
<ul>
<li>主站</li>
<li>番剧</li>
<li>游戏中心</li>
<li>直播</li>
<li>会员购</li>
</ul>
</xmp>
<div class='solve'>
<xmp class='code'>
1
2
3
4
5
6
7
8
9
10
11
12
</xmp>
</div>
</li>
</ol>
</div>
<footer></footer>
</body>
</html>
